<template>
  <div style="display: flex">
    <el-main>
      <div style="display: block;padding: 10px">
        <div style="display: flex;justify-content: start;margin-left: 50px;font-weight: bold">
          Pr详情
        </div>
        <div class="headerBar" style="display: block;margin-left: 50px;padding-top: 20px;padding-bottom: 10px;border-bottom: 2px solid #dce3e8">
          <div style="display: flex;padding-bottom: 10px;font-size: 30px;font-weight: bold">
            {{pr.prTitle}}
          </div>
          <div style="display: flex;align-content: center">
            <div v-if="pr.prStatus===1" style="color:#3fb950; display: flex;align-items: center">
              <el-icon ><CircleCheck /></el-icon>
              <div>开放</div>
            </div>
            <div v-else-if="pr.prStatus===2" style="color:grey; display: flex;align-items: center">
              <el-icon ><CircleCheck /></el-icon>
              <div>关闭</div>
            </div>
            <div v-else-if="pr.prStatus===3" style="color:#a371f7; display: flex;align-items: center">
              <el-icon ><CircleCheck /></el-icon>
              <div>合并</div>
            </div>
            <div style="display: flex;align-content: center;margin-left: 10px">
              {{pr.postName}}
            </div>
          </div>
        </div>
        <div style="display: flex;justify-content:start;margin-left: 50px;margin-top: 10px">
          <div  v-html="pr.prContent" class="content"> </div>
        </div>
      </div>
    </el-main>
    <el-aside width="400px" style="padding-left: 20px">
      <div style="display: block;padding: 10px">
        <div style="font-weight: bold;font-size: 20px;display: flex;justify-content: start">
          状态
        </div>
        <div style="display: flex;justify-content: start;padding: 10px">
          <div v-if="pr.prStatus===1" style="color:#3fb950; display: flex;align-items: center">
            <el-icon ><CircleCheck /></el-icon>
            <div>开放</div>
          </div>
          <div v-else-if="pr.prStatus===2" style="color:grey; display: flex;align-items: center">
            <el-icon ><CircleCheck /></el-icon>
            <div>关闭</div>
          </div>
          <div v-else-if="pr.prStatus===3" style="color:#a371f7; display: flex;align-items: center">
            <el-icon ><CircleCheck /></el-icon>
            <div>合并</div>
          </div>
        </div>
      </div>
    </el-aside>
  </div>
</template>

<script>
import request from "@/utils/request";
import {CircleClose,CircleCheck} from '@element-plus/icons-vue';
export default {
  data(){
    return{
      pr:'',
      prId:'',

    }
  },
  components: {
    CircleClose,
    CircleCheck
  },
  created(){
    this.prId=this.repoName=this.$route.params.prId
    this.load()
  },
  name: "Issue",
  methods:{
    load(){
      console.log(this.prId+"13123123123123")
      request.get("/pulls/get", {
        params:{
          prId:this.prId,
        }
      }).then(res => {
        console.log(res)
        this.pr=res.data
      })
    },
  }
}
</script>

<style scoped>

</style>
